<template>
	<transition name="el-zoom-in-center">
		<div class="JNPF-preview-main">
			<div class="JNPF-common-page-header">
				<el-page-header @back="goBack" :content="!dataForm.id ? '新建' : isDetail ? '详情' : '编辑'"/>
				<div class="options">
					<el-button type="primary" @click="dataFormSubmit()" v-if="!isDetail">确 定</el-button>
					<el-button @click="goBack">取 消</el-button>
				</div>
			</div>
			<el-row :gutter="15"  class="main" :style="{margin: '0 auto',width:'100%'}">
			<el-form ref="elForm" :model="dataForm" size="medium" label-width="330px" label-position="right" :disabled="!!isDetail" :rules="rules">
                <div class="JNPF-common-title mb-20">
					<h2 class="bold">基本信息</h2>
				</div>
                <el-row>
                    <el-col :span="12">
                        <el-form-item label="重大危险源编码" prop="zdwxybm" required >
                            <el-input v-model="dataForm.zdwxybm" placeholder="请输入" clearable disabled :style='{"width":"100%"}' prefix-icon="" suffix-icon="" >
                                <template slot="prepend"></template>
                                <template slot="append"></template>
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="重大危险源名称" prop="zdwxymc" required >
                            <el-input v-model="dataForm.zdwxymc" placeholder="请输入" clearable disabled :style='{"width":"100%"}' prefix-icon="" suffix-icon="" >
                                <template slot="prepend"></template>
                                <template slot="append"></template>
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="地理位置" prop="dz" required >
                            <el-select v-model="dataForm.dz" placeholder="请选择" clearable disabled :style='{"width":"100%"}' >
                                <el-option v-for="(item, index) in dzOptions" :key="index" :label="item.MC" :value="item.ID" ></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="管辖部门" prop="gxbm" required >
                            <el-select v-model="dataForm.gxbm" placeholder="请选择" clearable disabled :style='{"width":"100%"}' >
                                <el-option v-for="(item, index) in gxbmOptions" :key="index" :label="item.F_FullName" :value="item.F_Id" ></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="24">
                        <el-form-item label="危险源等级" prop="wxydj" required >
                            <el-select v-model="dataForm.wxydj" placeholder="请选择" clearable disabled :style='{"width":"100%"}' >
                                <el-option v-for="(item, index) in wxydjOptions" :key="index" :label="item.fullName" :value="item.id" ></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <div class="JNPF-common-title mb-20">
					<h2 class="bold">重大危险源备案信息</h2>
				</div>
                <el-row>
                    <el-col :span="24">
							<el-form-item label="辨识、分级记录" >
								<!-- <JNPF-UploadFz v-model="zdwxytzbList" accept="" :fileSize="10" sizeUnit="MB" :limit="1" buttonText="点击上传" >
								</JNPF-UploadFz> -->
								<el-button type="primary" @click="lookPGDetails">
									查看
								</el-button>
							</el-form-item>
						</el-col>
                    <el-col :span="12">
                        <el-form-item label="基本特征表" prop="zdwxytzb" >
                            <JNPF-UploadFz v-model="zdwxytzbList" disabled accept="" :fileSize="10" sizeUnit="MB" :limit="1" buttonText="点击上传" >
                            </JNPF-UploadFz>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="涉及的所有化学品安全技术说明书" prop="hxpsms" >
                            <JNPF-UploadFz v-model="hxpsmsList" disabled accept="" :fileSize="10" sizeUnit="MB" :limit="1" buttonText="点击上传" >
                            </JNPF-UploadFz>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="区域位置图" prop="qywzt" >
                            <JNPF-UploadImg v-model="qywztList" disabled accept="" :fileSize="10" sizeUnit="MB" :limit="1" >
                            </JNPF-UploadImg>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="平面布置图" prop="pmbzt" >
                            <JNPF-UploadImg v-model="pmbztList" disabled accept="" :fileSize="10" sizeUnit="MB" :limit="1" >
                            </JNPF-UploadImg>
                        </el-form-item>
                    </el-col>
                    <el-col :span="24">
                        <el-form-item label="工艺流程图" prop="gylct" >
                            <JNPF-UploadImg v-model="gylctList" disabled accept="" :fileSize="10" sizeUnit="MB" :limit="1" >
                            </JNPF-UploadImg>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="主要设备表" prop="zysbb" >
                            <JNPF-UploadFz v-model="zysbbList" disabled accept="" :fileSize="10" sizeUnit="MB" :limit="1" buttonText="点击上传" >
                            </JNPF-UploadFz>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="安全管理规章制度及安全操作规程" prop="zdwxyczgc" >
                            <JNPF-UploadFz v-model="zdwxyczgcList" disabled accept="" :fileSize="10" sizeUnit="MB" :limit="1" buttonText="点击上传" >
                            </JNPF-UploadFz>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="安全监测监控系统、措施说明、检测、检验结果" prop="aqjcjkxt" >
                            <JNPF-UploadFz v-model="aqjcjkxtList" disabled accept="" :fileSize="10" sizeUnit="MB" :limit="1" buttonText="点击上传" >
                            </JNPF-UploadFz>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="事故应急预案、评审意见、演练计划和评估报告" prop="sgyjya" >
                            <JNPF-UploadFz v-model="sgyjyaList" disabled accept="" :fileSize="10" sizeUnit="MB" :limit="1" buttonText="点击上传" >
                            </JNPF-UploadFz>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="安全评估报告或者安全评价报告" prop="aqpgbg" >
                            <JNPF-UploadFz v-model="aqpgbgList" disabled accept="" :fileSize="10" sizeUnit="MB" :limit="1" buttonText="点击上传" >
                            </JNPF-UploadFz>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="关键装置、重点部位的责任人、责任机构名称" prop="zdwxygjzz" >
                            <JNPF-UploadFz v-model="zdwxygjzzList" disabled accept="" :fileSize="10" sizeUnit="MB" :limit="1" buttonText="点击上传" >
                            </JNPF-UploadFz>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="场所安全警示标志的设置情况" prop="zdwxyjsbz" >
                            <JNPF-UploadFz v-model="zdwxyjsbzList" disabled accept="" :fileSize="10" sizeUnit="MB" :limit="1" buttonText="点击上传" >
                            </JNPF-UploadFz>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="其他文件、资料" prop="qtwj" >
                            <JNPF-UploadFz v-model="qtwjList" disabled accept="" :fileSize="10" sizeUnit="MB" :limit="1" buttonText="点击上传" >
                            </JNPF-UploadFz>
                        </el-form-item>
                    </el-col>
                    <!-- <el-col :span="12">
							<el-form-item label="备案时间" prop="basj" >
								<el-date-picker v-model="dataForm.basj" placeholder="请选择" clearable disabled :style='{"width":"100%"}' type="datetime" format="yyyy-MM-dd HH:mm:ss" value-format="timestamp" >
								</el-date-picker>
							</el-form-item>
					</el-col>
                    <el-col :span="12">
                        <el-form-item label="状态" prop="zt" >
                            <el-select v-model="dataForm.zt" placeholder="请选择" clearable disabled :style='{"width":"100%"}' >
                                <el-option v-for="(item, index) in ztOptions" :key="index" :label="item.fullName" :value="item.id" ></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col> -->
                </el-row>
				 <div class="JNPF-common-title mb-20">
					<h2 class="bold">重大危险源核销信息</h2>
				</div>
                <el-row>
                    <el-col :span="12">
                        <el-form-item label="核销理由" prop="hxly" required >
                            <el-input v-model="dataForm.hxly" placeholder="请输入" clearable :style='{"width":"100%"}' prefix-icon="" suffix-icon="" >
                                <template slot="prepend"></template>
                                <template slot="append"></template>
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="备案告知书" prop="zdwxybagzs" >
                            <JNPF-UploadFz v-model="zdwxybagzsList" accept="" :fileSize="10" sizeUnit="MB" :limit="1" buttonText="点击上传" >
                            </JNPF-UploadFz>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="核销安全评估报告或安全评价报告" prop="hxaqpgbg" >
                            <JNPF-UploadFz v-model="hxaqpgbgList" accept="" :fileSize="10" sizeUnit="MB" :limit="1" buttonText="点击上传" >
                            </JNPF-UploadFz>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="核销其他文件、资料" prop="hxqtwj" >
                            <JNPF-UploadFz v-model="hxqtwjList" accept="" :fileSize="10" sizeUnit="MB" :limit="1" buttonText="点击上传" >
                            </JNPF-UploadFz>
                        </el-form-item>
                    </el-col>
                </el-row>
			</el-form>
			</el-row>
            <GoodsBox v-if="goodsBoxVisible" ref="goodsBox" />
		</div>
	</transition>

</template>
<script>
import request from '@/utils/request'
import {getDictionaryDataSelector}from '@/api/systemData/dictionary'
import {previewDataInterface}from '@/api/systemData/dataInterface'
import GoodsBox from './WxydaBox'
export default {
    components: { GoodsBox },
    data() {
      return {
        goodsBoxVisible: false,  //-
        visible: false,
        isDetail: false,
        dataForm: {
					zdwxybm:undefined,
					zdwxymc:undefined,
					dz:undefined,
					gxbm:undefined,
					wxydj:undefined,
					zdwxytzb:undefined,
					hxpsms:undefined,
					qywzt:undefined,
					pmbzt:undefined,
					gylct:undefined,
					zysbb:undefined,
					zdwxyczgc:undefined,
					aqjcjkxt:undefined,
					sgyjya:undefined,
					aqpgbg:undefined,
					zdwxygjzz:undefined,
					zdwxyjsbz:undefined,
					qtwj:undefined,
					// basj:undefined,
					zt:undefined,
					hxly:undefined,
					zdwxybagzs:undefined,
					hxaqpgbg:undefined,
					hxqtwj:undefined,

        },
        rules: {
                zdwxybm:[
                {
                    required:true,
                    message:'请输入重大危险源编码',
                    trigger:'blur'
                },
                ],
                zdwxymc:[
                {
                    required:true,
                    message:'请输入重大危险源名称',
                    trigger:'blur'
                },
                ],
                dz:[
                {
                    required:true,
                    message:'请输入地理位置',
                    trigger:'blur'
                },
                ],
                gxbm:[
                {
                    required:true,
                    message:'请输入管辖部门',
                    trigger:'blur'
                },
                ],
                wxydj:[
                {
                    required:true,
                    message:'请输入危险源等级',
                    trigger:'blur'
                },
                ],
                hxly:[
                {
                    required:true,
                    message:'请输入核销理由',
                    trigger:'blur'
                },
                ],

        },
        dzOptions:[],
        gxbmOptions:[],
        wxydjOptions:[{"fullName":"一级","id":"01"},{"fullName":"二级","id":"02"},{"fullName":"三级","id":"03"},{"fullName":"四级","id":"04"},{"fullName":"不构成危化品重大危险源","id":"05"}],
        ztOptions:[{"fullName":"未备案","id":"1"},{"fullName":"已备案","id":"2"},{"fullName":"已更改","id":"3"},{"fullName":"已核销","id":"4"}],

        zdwxytzbList:[],
        hxpsmsList:[],
        qywztList:[],
        pmbztList:[],
        gylctList:[],
        zysbbList:[],
        zdwxyczgcList:[],
        aqjcjkxtList:[],
        sgyjyaList:[],
        aqpgbgList:[],
        zdwxygjzzList:[],
        zdwxyjsbzList:[],
        qtwjList:[],
        zdwxybagzsList:[],
        hxaqpgbgList:[],
        hxqtwjList:[],
        dataId: ''

      }
    },
    created() {
		this.getDzOptions();
		this.getGxbmOptions();

    },
    methods: {
		getDzOptions()
		{
			previewDataInterface('e7b2c31f5a7147c08629c5409dd7fdf4').then(res => {
				this.dzOptions = res.data
			})
		},
		getGxbmOptions()
		{
			previewDataInterface('772d2cbcadd24df79243e3d92ef5f690').then(res => {
				this.gxbmOptions = res.data
			})
		},

        goBack() {
            this.$emit('refresh')
        },
        init(id, isDetail) {
            this.dataId = id;
            this.dataForm.id = id || 0;
            this.visible = true;
            this.isDetail = isDetail || false;
            this.$nextTick(() => {
            this.$refs['elForm'].resetFields();
            if (this.dataForm.id) {
                request({
                url: '/api/system/ZDWXYDA/' + this.dataForm.id,
                method: 'get'
                }).then(res =>{
                this.dataForm = res.data;
                    this.zdwxytzbList = this.dataForm.zdwxytzb ? JSON.parse(this.dataForm.zdwxytzb) : [];
                    this.hxpsmsList = this.dataForm.hxpsms ? JSON.parse(this.dataForm.hxpsms) : [];
                    this.qywztList = this.dataForm.qywzt ? JSON.parse(this.dataForm.qywzt) : [];
                    this.pmbztList = this.dataForm.pmbzt ? JSON.parse(this.dataForm.pmbzt) : [];
                    this.gylctList = this.dataForm.gylct ? JSON.parse(this.dataForm.gylct) : [];
                    this.zysbbList = this.dataForm.zysbb ? JSON.parse(this.dataForm.zysbb) : [];
                    this.zdwxyczgcList = this.dataForm.zdwxyczgc ? JSON.parse(this.dataForm.zdwxyczgc) : [];
                    this.aqjcjkxtList = this.dataForm.aqjcjkxt ? JSON.parse(this.dataForm.aqjcjkxt) : [];
                    this.sgyjyaList = this.dataForm.sgyjya ? JSON.parse(this.dataForm.sgyjya) : [];
                    this.aqpgbgList = this.dataForm.aqpgbg ? JSON.parse(this.dataForm.aqpgbg) : [];
                    this.zdwxygjzzList = this.dataForm.zdwxygjzz ? JSON.parse(this.dataForm.zdwxygjzz) : [];
                    this.zdwxyjsbzList = this.dataForm.zdwxyjsbz ? JSON.parse(this.dataForm.zdwxyjsbz) : [];
                    this.qtwjList = this.dataForm.qtwj ? JSON.parse(this.dataForm.qtwj) : [];
                    this.zdwxybagzsList = this.dataForm.zdwxybagzs ? JSON.parse(this.dataForm.zdwxybagzs) : [];
                    this.hxaqpgbgList = this.dataForm.hxaqpgbg ? JSON.parse(this.dataForm.hxaqpgbg) : [];
                    this.hxqtwjList = this.dataForm.hxqtwj ? JSON.parse(this.dataForm.hxqtwj) : [];

                })
            }
            })
        },
      // 表单提交
      dataFormSubmit() {
        this.$refs['elForm'].validate((valid) => {
          if (valid) {
				this.$set(this.dataForm, 'zdwxytzb', JSON.stringify(this.zdwxytzbList));
				this.$set(this.dataForm, 'hxpsms', JSON.stringify(this.hxpsmsList));
				this.$set(this.dataForm, 'qywzt', JSON.stringify(this.qywztList));
				this.$set(this.dataForm, 'pmbzt', JSON.stringify(this.pmbztList));
				this.$set(this.dataForm, 'gylct', JSON.stringify(this.gylctList));
				this.$set(this.dataForm, 'zysbb', JSON.stringify(this.zysbbList));
				this.$set(this.dataForm, 'zdwxyczgc', JSON.stringify(this.zdwxyczgcList));
				this.$set(this.dataForm, 'aqjcjkxt', JSON.stringify(this.aqjcjkxtList));
				this.$set(this.dataForm, 'sgyjya', JSON.stringify(this.sgyjyaList));
				this.$set(this.dataForm, 'aqpgbg', JSON.stringify(this.aqpgbgList));
				this.$set(this.dataForm, 'zdwxygjzz', JSON.stringify(this.zdwxygjzzList));
				this.$set(this.dataForm, 'zdwxyjsbz', JSON.stringify(this.zdwxyjsbzList));
				this.$set(this.dataForm, 'qtwj', JSON.stringify(this.qtwjList));
				this.$set(this.dataForm, 'zdwxybagzs', JSON.stringify(this.zdwxybagzsList));
				this.$set(this.dataForm, 'hxaqpgbg', JSON.stringify(this.hxaqpgbgList));
				this.$set(this.dataForm, 'hxqtwj', JSON.stringify(this.hxqtwjList));

            // if (!this.dataForm.id) {
            //   request({
            //     url: '/api/system/ZDWXYDA',
            //     method: 'post',
            //     data: this.dataForm,
            //   }).then((res) =>{
            //     this.$message({
            //       message: res.msg,
            //       type: 'success',
            //       duration: 1000,
            //       onClose: () =>{
            //         this.visible = false;
            //         this.$emit('refresh', true);
            //       }
            //     })
            //   })
            // } else {
              this.dataForm.zt = 4;  
              request({
                url: '/api/system/ZDWXYDA/' + this.dataForm.id,
                method: 'PUT',
                data: this.dataForm
              }).then((res) =>{
                this.$message({
                  message: res.msg,
                  type: 'success',
                  duration: 1000,
                  onClose: () =>{
                    this.visible = false;
                    this.$emit('refresh', true);
                  }
                })
              })
            // }
          }
        })
      },

      //-
		lookPGDetails(){
			this.goodsBoxVisible = true;
			let dataId = this.dataId;
			this.$nextTick(() => {
				this.$refs.goodsBox.init(dataId)
			})
		}

    }
  }
</script>